<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>shader</title>
</head>
<body style="margin: 0;">
    <div id="container"></div>
</body>
<script id="vertexShader" type="x-shader/x-vertex">
    varying vec2 vUv;
    varying vec3 vNormal;
	varying vec3 vColor;
    void main() {
        vUv = uv;
        vNormal = normal;
        // gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
        gl_Position = vec4( position, 1.0 );
    }
</script>
<script id="fragmentShader" type="x-shader/x-fragment">
    varying vec2 vUv;
    varying vec3 normal;
    float random (vec2 st) {
        return fract(sin(dot(st.xy,vec2(12.9898,78.233)))*43758.5453123);
    }
    void main() {
        float i = mod(vUv.x * 10.0, 1.0);
        float j = sin(vUv.x * 10.0);
        float r = random(vUv);
        i = step(0.2, i);
        i *= step(0.2, mod(vUv.y * 10.0, 1.0));
        gl_FragColor = vec4(vec3(i, i, i), 1);
    }
</script>
<script src="./js/three.min.js"></script>
<script src="./js/controls/OrbitControls.js"></script>
<script src="./js/base.js"></script>
</html>